index.vue 33 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620621622623624625626627628629630631632633634635636637638639640641642643644645646647648649650651652653654655656657658659660661662663664665666667668669670671672673674675676677678679680681682683684685686687688689690691692693694695696697698699700701702703704705706707708709710711712713714715716717718719720721722723724725726727728729730731732733734735736737738739740741742743744745746747748749750751752753754755756757758759760761762763764
  1. <template>
  2. <div>
  3. <HomePageHead></HomePageHead>
  4. <HomePageNavigation></HomePageNavigation>
  5. <HomeSecondaryHeading :titleData="pageData"></HomeSecondaryHeading>
  6. <div class="farmingPartOne">
  7. <div class="inner">
  8. <div class="innerLeft" v-if="pageData.length>0">
  9. <div class="title">
  10. <h3>
  11. <NuxtLink :href="getLinkPath(pageData[0])" v-if="pageData[0]" :title="pageData[0].alias">
  12. {{ pageData[0].alias }}
  13. </NuxtLink>
  14. <span>
  15. <NuxtLink :href="getLinkPath(pageData[0])" v-if="pageData[0]" :title="pageData[0].title">
  16. 查看更多
  17. </NuxtLink>
  18. </span>
  19. </h3>
  20. </div>
  21. <div class="leftTop">
  22. <div class="leftTopPhoto left" v-if="pageData[0].data[0]">
  23. <NuxtLink :href="getLinkPathDetail(pageData[0].data[0])" :title="pageData[0].data[0].title">
  24. <img :src="pageData[0].data[0].imgurl" :alt="pageData[0].data[0].title">
  25. <span>{{pageData[0].data[0].title }}</span>
  26. </NuxtLink>
  27. </div>
  28. <div class="leftTopPhoto left" v-else></div>
  29. <ul class="left">
  30. <li v-for="item in pageData[0].data3">
  31. <em></em>
  32. <span>
  33. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  34. {{ item.title }}
  35. </NuxtLink>
  36. </span>
  37. </li>
  38. </ul>
  39. </div>
  40. <ul class="leftBottom" v-if="pageData[0].data2[0]!=null">
  41. <li v-for="item in pageData[0].data2">
  42. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  43. <img :src="item.imgurl" :alt="item.title">
  44. </NuxtLink>
  45. <p>
  46. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  47. {{ item.title }}
  48. </NuxtLink>
  49. </p>
  50. </li>
  51. </ul>
  52. </div>
  53. <div class="innerRight" v-if="pageData.length>=2">
  54. <div class="title">
  55. <h3>
  56. <NuxtLink :href="getLinkPath(pageData[1])" v-if="pageData[1]" :title="pageData[1].alias">
  57. {{ pageData[1].alias }}
  58. </NuxtLink>
  59. <span>
  60. <NuxtLink :href="getLinkPath(pageData[1])" v-if="pageData[1]" :title="pageData[1].title">
  61. 查看更多
  62. </NuxtLink>
  63. </span>
  64. </h3>
  65. </div>
  66. <ul class="rightList">
  67. <li v-for="item in pageData[1].data">
  68. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  69. <img class="left" :src="item.imgurl" :alt="item.title">
  70. </NuxtLink>
  71. <p class="left">
  72. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  73. {{ item.title }}
  74. </NuxtLink>
  75. </p>
  76. </li>
  77. </ul>
  78. </div>
  79. </div>
  80. </div>
  81. <HomeTopTen :imgurl="adImg1" v-if="adImg1"></HomeTopTen>
  82. <div class="farmingPartTwo" v-if="pageData.length>=3">
  83. <div class="inner">
  84. <div class="farmer" v-if="pageData.length>=3">
  85. <div class="title">
  86. <h3>
  87. <NuxtLink :href="getLinkPath(pageData[2])" v-if="pageData[2]" :title="pageData[2].alias">
  88. {{ pageData[2].alias }}
  89. </NuxtLink>
  90. <span>
  91. <NuxtLink :href="getLinkPath(pageData[2])" v-if="pageData[2]" :title="pageData[2].title">
  92. 查看更多
  93. </NuxtLink>
  94. </span>
  95. </h3>
  96. </div>
  97. <div class="PartTwoPhoto">
  98. <div v-if="pageData[2].data[0]">
  99. <NuxtLink :href="getLinkPathDetail(pageData[2].data[0])" :title="pageData[2].data[0].title">
  100. <img :src="pageData[2].data[0].imgurl" :alt="pageData[2].data[0].title">
  101. <span>{{ pageData[2].data[0].title }}</span>
  102. </NuxtLink>
  103. </div>
  104. </div>
  105. <ul class="PartTwoList">
  106. <li v-for="item in pageData[2].data2">
  107. <em></em>
  108. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  109. {{ item.title }}
  110. </NuxtLink>
  111. </li>
  112. </ul>
  113. </div>
  114. <div class="farmer" v-if="pageData.length>=4">
  115. <div class="title">
  116. <h3>
  117. <NuxtLink :href="getLinkPath(pageData[3])" v-if="pageData[3]" :title="pageData[3].alias">
  118. {{ pageData[3].alias }}
  119. </NuxtLink>
  120. <span>
  121. <NuxtLink :href="getLinkPath(pageData[3])" v-if="pageData[3]" :title="pageData[3].title">
  122. 查看更多
  123. </NuxtLink>
  124. </span>
  125. </h3>
  126. </div>
  127. <div class="PartTwoPhoto">
  128. <div v-if="pageData[3].data[0]">
  129. <NuxtLink :href="getLinkPathDetail(pageData[3].data[0])" :title="pageData[3].data[0].title">
  130. <img :src="pageData[3].data[0].imgurl" :alt="pageData[3].data[0].title">
  131. <span>{{ pageData[3].data[0].title }}</span>
  132. </NuxtLink>
  133. </div>
  134. </div>
  135. <ul class="PartTwoList">
  136. <li v-for="item in pageData[3].data2">
  137. <em></em>
  138. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  139. {{ item.title }}
  140. </NuxtLink>
  141. </li>
  142. </ul>
  143. </div>
  144. <div class="farmer" v-if="pageData.length>=5">
  145. <div class="title">
  146. <h3>
  147. <NuxtLink :href="getLinkPath(pageData[4])" v-if="pageData[4]" :title="pageData[4].alias">
  148. {{ pageData[4].alias }}
  149. </NuxtLink>
  150. <span>
  151. <NuxtLink :href="getLinkPath(pageData[4])" v-if="pageData[4]" :title="pageData[4].title">
  152. 查看更多
  153. </NuxtLink>
  154. </span>
  155. </h3>
  156. </div>
  157. <div class="PartTwoPhoto">
  158. <div v-if="pageData[4].data[0]">
  159. <NuxtLink :href="getLinkPathDetail(pageData[4].data[0])" :title="pageData[4].data[0].title">
  160. <img :src="pageData[4].data[0].imgurl" :alt="pageData[4].data[0].title">
  161. <span>{{ pageData[4].data[0].title }}</span>
  162. </NuxtLink>
  163. </div>
  164. </div>
  165. <ul class="PartTwoList">
  166. <li v-for="item in pageData[4].data2">
  167. <em></em>
  168. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  169. {{ item.title }}
  170. </NuxtLink>
  171. </li>
  172. </ul>
  173. </div>
  174. </div>
  175. </div>
  176. <HomeTopTen :imgurl="adImg2" v-if="adImg2"></HomeTopTen>
  177. <div class="zixuntuijian" v-if="pageData.length>=6">
  178. <div class="inner">
  179. <div class="innerLeft" >
  180. <div class="zixunTop">
  181. <div class="zixunLeft" v-if="pageData.length>=6">
  182. <div class="title">
  183. <h3>
  184. <NuxtLink :href="getLinkPath(pageData[5])" v-if="pageData[5]" :title="pageData[5].alias">
  185. {{ pageData[5].alias }}
  186. </NuxtLink>
  187. <span>
  188. <NuxtLink :href="getLinkPath(pageData[5])" v-if="pageData[5]" :title="pageData[5].title">
  189. 查看更多
  190. </NuxtLink>
  191. </span>
  192. </h3>
  193. </div>
  194. <ul class="photo_text" v-if="pageData[5].data[0]!= null">
  195. <li v-for="item in pageData[5].data">
  196. <article>
  197. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  198. <img :src="item.imgurl" :alt="item.title">
  199. </NuxtLink>
  200. <div>
  201. <h5>
  202. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  203. {{ item.title }}
  204. </NuxtLink>
  205. </h5>
  206. <p>
  207. <span>{{ item.author }}</span>
  208. <span>{{ getTime(item.updated_at,'month',1) }}</span>
  209. </p>
  210. </div>
  211. </article>
  212. </li>
  213. <li v-for="item in pageData[5].data2">
  214. <article>
  215. <em></em>
  216. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  217. {{ item.title }}
  218. </NuxtLink>
  219. </article>
  220. </li>
  221. </ul>
  222. </div>
  223. <div class="zixunRight" v-if="pageData.length>=7">
  224. <div class="title">
  225. <h3>
  226. <NuxtLink :href="getLinkPath(pageData[6])" v-if="pageData[6]" :title="pageData[6].alias">
  227. {{ pageData[6].alias }}
  228. </NuxtLink>
  229. <span>
  230. <NuxtLink :href="getLinkPath(pageData[6])" v-if="pageData[6]" :title="pageData[6].title">
  231. 查看更多
  232. </NuxtLink>
  233. </span>
  234. </h3>
  235. </div>
  236. <div class="towPic">
  237. <div v-for="item in pageData[6].data" class="picBox">
  238. <div>
  239. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  240. <img :src="item.imgurl" :alt="item.title">
  241. </NuxtLink>
  242. </div>
  243. </div>
  244. </div>
  245. <ul class="photo_text">
  246. <li v-for="item in pageData[6].data2">
  247. <article>
  248. <em></em>
  249. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  250. {{ item.title }}
  251. </NuxtLink>
  252. </article>
  253. </li>
  254. </ul>
  255. </div>
  256. </div>
  257. <div class="zixunBottom" v-if="pageData[7].data[0] != null">
  258. <img class="left" :src="pageData[7].data[0].imgurl" :alt="pageData[7].data[0].title"
  259. v-if="pageData[7].data[0] && hoverStatus == 0">
  260. <img class="left" :src="pageData[7].data[1].imgurl" :alt="pageData[7].data[1].title"
  261. v-if="pageData[7].data[1] && hoverStatus == 1">
  262. <img class="left" :src="pageData[7].data[2].imgurl" :alt="pageData[7].data[2].title"
  263. v-if="pageData[7].data[2] && hoverStatus == 2">
  264. <img class="left" :src="pageData[7].data[3].imgurl" :alt="pageData[7].data[3].title"
  265. v-if="pageData[7].data[3] && hoverStatus == 3">
  266. <img class="left" :src="pageData[7].data[4].imgurl" :alt="pageData[7].data[4].title"
  267. v-if="pageData[7].data[4] && hoverStatus == 4">
  268. <img class="left" :src="pageData[7].data[5].imgurl" :alt="pageData[7].data[5].title"
  269. v-if="pageData[7].data[5] && hoverStatus == 5">
  270. <ul class="leftList left">
  271. <li v-for="(item, index) in pageData[7].data" @mouseenter="qhPic(index)">
  272. <h4>
  273. <em></em>
  274. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  275. {{ item.title }}
  276. </NuxtLink>
  277. </h4>
  278. </li>
  279. </ul>
  280. </div>
  281. </div>
  282. <div class="innerRight" v-if="pageData.length>=8">
  283. <div class="title">
  284. <h3>
  285. <NuxtLink :href="getLinkPath(pageData[7])" v-if="pageData[7]" :title="pageData[7].alias">
  286. {{ pageData[7].alias }}
  287. </NuxtLink>
  288. <span>
  289. <NuxtLink :href="getLinkPath(pageData[7])" v-if="pageData[7]" :title="pageData[7].title">
  290. 查看更多
  291. </NuxtLink>
  292. </span>
  293. </h3>
  294. </div>
  295. <ul class="information">
  296. <li v-for="item in pageData[7].data2">
  297. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  298. <img :src="item.imgurl" :alt="item.title">
  299. </NuxtLink>
  300. <div class="text">
  301. <h5>
  302. <NuxtLink :href="getLinkPathDetail(item)" :title="item.title">
  303. {{ item.title }}
  304. </NuxtLink>
  305. </h5>
  306. <p>{{ item.author }}</p>
  307. </div>
  308. </li>
  309. </ul>
  310. </div>
  311. </div>
  312. </div>
  313. <HomeTopTen :imgurl="adImg3" v-if="adImg3"></HomeTopTen>
  314. <!-- 十强称号logo -->
  315. <HomeTopTen :imgurl="adImg4" v-if="adImg4"></HomeTopTen>
  316. <!-- 页脚部分 -->
  317. <HomeFoot1></HomeFoot1>
  318. </div>
  319. </template>
  320. <script setup>
  321. //0.加载页面依赖 start ---------------------------------------->
  322. import { ref, onMounted } from 'vue';
  323. //格式化跳转路径 - 标题
  324. //首页分类栏目标题,不需要考虑外链
  325. const getLinkPath = (item) => {
  326. //return `/${item.url}/1.html`;
  327. return `/newsList/${item.cid}?page=1`;
  328. }
  329. //首页跳转到详情,这里需要考虑外链
  330. const getLinkPathDetail = (item) => {
  331. if (item.islink == 1) {
  332. return `${item.linkurl}`;
  333. } else {
  334. //return `/${item.aLIas_pinyin}/${item.id}`;
  335. return `/newsDetail/${item.id}`
  336. }
  337. }
  338. //0.加载页面依赖 end ---------------------------------------->
  339. //1.获得路由id start ---------------------------------------->
  340. const route = useRoute();
  341. //获得当前的完整路径
  342. const fullPath = route.path;
  343. //拆分,取出来中间这一段,然后提取数字部分
  344. const segments = fullPath.split('/');
  345. const targetSegment = segments[2];
  346. const numberPart = targetSegment.match(/\d+$/)?.[0];
  347. //路由id
  348. //let routeId = 11 //排除路径错误可以打开这个
  349. let routeId = numberPart;
  350. //1.获得路由id end ---------------------------------------->
  351. //2.页面交互效果 start ---------------------------------------->
  352. //2.1 新闻图片切换
  353. const hoverStatus = ref(0)
  354. const qhPic = function (num) {
  355. console.log(num)
  356. hoverStatus.value = num;
  357. }
  358. //2.2 选项卡切换
  359. let showTabs = ref(1)
  360. let qhtabs = function (number) {
  361. console.log(number)
  362. showTabs.value = number
  363. }
  364. //2.3 展示广告
  365. let adImg1 = ref({})
  366. let adImg2 = ref({})
  367. let adImg3 = ref({})
  368. let adImg4 = ref({})
  369. onMounted(async () => {
  370. //从客户端获取行政职能部门 加快打开速度
  371. const { $webUrl, $CwebUrl } = useNuxtApp();
  372. //广告1
  373. let url = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_category_0001`
  374. const responseAd1 = await fetch(url, {
  375. headers: {
  376. 'Content-Type': 'application/json',
  377. 'Userurl': $CwebUrl,
  378. 'Origin': $CwebUrl
  379. }
  380. });
  381. const resultAd1 = await responseAd1.json();
  382. adImg1.value = resultAd1.data[0];
  383. //广告2
  384. let url2 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_category_0002`
  385. const responseAd2 = await fetch(url2, {
  386. headers: {
  387. 'Content-Type': 'application/json',
  388. 'Userurl': $CwebUrl,
  389. 'Origin': $CwebUrl
  390. }
  391. });
  392. const resultAd2 = await responseAd2.json();
  393. adImg2.value = resultAd2.data[0];
  394. //广告3
  395. let url3 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_category_0003`
  396. const responseAd3 = await fetch(url3, {
  397. headers: {
  398. 'Content-Type': 'application/json',
  399. 'Userurl': $CwebUrl,
  400. 'Origin': $CwebUrl
  401. }
  402. });
  403. const resultAd3 = await responseAd3.json();
  404. adImg3.value = resultAd3.data[0];
  405. //广告4
  406. let url4 = `${$webUrl}/web/getWebsiteAdvertisement?ad_tag=snzxw_category_0004`
  407. const responseAd4 = await fetch(url4, {
  408. headers: {
  409. 'Content-Type': 'application/json',
  410. 'Userurl': $CwebUrl,
  411. 'Origin': $CwebUrl
  412. }
  413. });
  414. const resultAd4 = await responseAd4.json();
  415. adImg4.value = resultAd4.data[0];
  416. })
  417. //2.页面交互效果 end ---------------------------------------->
  418. //3.渲染页面数据 start ---------------------------------------->
  419. //3.1 该页面上所有的导航池 转为动态数据
  420. const pageCategory = ref([]);
  421. //3.2 该页面上需要渲染的所有数据
  422. const pageData = ref([
  423. // { id: 0, data: [], data2: [], title: "", cid: "" },
  424. // { id: 1, data: [], title: "", cid: "" },
  425. // { id: 2, data: [], title: "", cid: "" },
  426. // { id: 3, data: [], title: "", cid: "" },
  427. // { id: 4, data: [], title: "", cid: "" },
  428. // { id: 5, data: [], title: "", cid: "" },
  429. // { id: 6, data: [], title: "", cid: "" },
  430. // { id: 7, data: [], title: "", cid: "" },
  431. // { id: 8, data: [], title: "", cid: "" },
  432. // { id: 9, data: [], title: "", cid: "" },
  433. // { id: 10, data: [], title: "", cid: "" },
  434. // { id: 10, data: [], title: "", cid: "" },
  435. // {
  436. // id: 11,
  437. // title: "",
  438. // data: [],
  439. // data1: [],
  440. // data2: [],
  441. // data3: [],
  442. // data4: [],
  443. // category_id1: "",
  444. // category_id2: "",
  445. // category_id3: "",
  446. // category_id4: "",
  447. // title1: "",
  448. // title2: "",
  449. // title3: "",
  450. // title4: "",
  451. // cid: ""
  452. // },
  453. // { id: 12, data1: [], data2: [], data3: [], cid: "" },
  454. ])
  455. const navSize = ref("");
  456. //3.3 获取所有导航
  457. try {
  458. const navigateData = await requestDataPromise('/web/getWebsiteModelCategory', {
  459. method: 'GET',
  460. query: {
  461. 'placeid': 1,
  462. 'pid': routeId,
  463. 'num': 8
  464. },
  465. });
  466. if(navigateData.code == 200){
  467. // 遍历可用的导航池放到页面中
  468. for (let index in navigateData.data) {
  469. let data = {
  470. title: navigateData.data[index].name,
  471. cid: navigateData.data[index].category_id,
  472. children_count: navigateData.data[index].children_count,
  473. alias: navigateData.data[index].alias,
  474. url: navigateData.data[index].aLIas_pinyin,
  475. data:[],
  476. data1:[],
  477. data2:[],
  478. data3:[],
  479. data4:[],
  480. category_id1:"",
  481. category_id2:"",
  482. category_id3:"",
  483. category_id4:"",
  484. title1: "",
  485. title2: "",
  486. title3: "",
  487. title4: ""
  488. };
  489. if (navigateData.data[index].is_url == 1) {
  490. // 处理 URL 的逻辑
  491. } else {
  492. //每个页面最多8个模块
  493. pageData.value.push(data);
  494. }
  495. }
  496. //导航池加载完毕,开始申请模块数据
  497. // await getPageData1();
  498. // await getPageData2();
  499. // await getPageData3();
  500. // await getPageData4();
  501. // await getPageData5();
  502. // await getPageData6();
  503. // await getPageData7();
  504. // await getPageData8();
  505. let getJson = [
  506. {"parent":pageData.value[0].cid + ",5,8","child":""},//模块1理论前沿
  507. {"parent":pageData.value[1].cid + ",5,0","child":""},//模块2典型经验
  508. {"parent":pageData.value[2].cid + ",1,6","child":""},//模块3农业天地
  509. {"parent":pageData.value[3].cid + ",1,6","child":""},//模块4美丽乡村
  510. {"parent":pageData.value[4].cid + ",1,6","child":""},//模块5农民之家
  511. {"parent":pageData.value[5].cid + ",6,3","child":""},//模块6农业天地
  512. {"parent":pageData.value[6].cid + ",2,3","child":""},//模块7农村建设
  513. {"parent":pageData.value[7].cid + ",4,0","child":""},//模块8高端资讯
  514. ]
  515. let jsonString = JSON.stringify(getJson);
  516. getPageAllData(jsonString);
  517. }else{
  518. console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  519. console.log("错误位置:分类页导航池")
  520. console.log("后端错误反馈:",navigateData.message)
  521. console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  522. }
  523. } catch (error) {
  524. console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  525. console.log("错误位置:分类页导航渲染阶段")
  526. console.log("错误:导航池渲染执行接口出错!请检查首页的14的模块的具体执行方法!")
  527. console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  528. }
  529. async function getPageAllData(jsonString){
  530. const mkdata = await requestDataPromise('/web/getWebsiteAllArticle', {
  531. method: 'GET',
  532. query: {
  533. 'id':jsonString
  534. },
  535. });
  536. if(mkdata.code==200){
  537. //模块1理论前沿
  538. if(mkdata.data[0].imgnum.length > 0){
  539. pageData.value[0].data.push(mkdata.data[0].imgnum[0]);
  540. }
  541. if(mkdata.data[0].imgnum.length > 1){
  542. pageData.value[0].data2.push(mkdata.data[0].imgnum[1]);
  543. }
  544. if(mkdata.data[0].imgnum.length > 2){
  545. pageData.value[0].data2.push(mkdata.data[0].imgnum[2]);
  546. }
  547. if(mkdata.data[0].imgnum.length > 3){
  548. pageData.value[0].data2.push(mkdata.data[0].imgnum[3]);
  549. }
  550. if(mkdata.data[0].imgnum.length > 4){
  551. pageData.value[0].data2.push(mkdata.data[0].imgnum[4]);
  552. }
  553. pageData.value[0].data3 = mkdata.data[0].textnum;
  554. //模块2典型经验
  555. pageData.value[1].data = mkdata.data[1].imgnum;
  556. //模块3农业天地
  557. pageData.value[2].data = mkdata.data[2].imgnum;
  558. pageData.value[2].data2 = mkdata.data[2].textnum;
  559. //模块4美丽乡村
  560. pageData.value[3].data = mkdata.data[3].imgnum;
  561. pageData.value[3].data2 = mkdata.data[3].textnum;
  562. //模块5农民之家
  563. pageData.value[4].data = mkdata.data[4].imgnum;
  564. pageData.value[4].data2 = mkdata.data[4].textnum;
  565. //模块6农业天地 注意,三农资讯网跟其他行星站不一样,你不需要复制我这个
  566. //因为本来二级分类页有9个模块,但是实际应用中只有8个,所以我把本来是模块7
  567. //的地方和现有的模块6合并成1个了
  568. if(mkdata.data[5].imgnum.length > 0){
  569. pageData.value[5].data.push(mkdata.data[5].imgnum[0]);
  570. }
  571. pageData.value[5].data2 = mkdata.data[5].textnum;
  572. //把模块6的内容放到模块7中一部分
  573. for (let i = 1; i < mkdata.data[5].imgnum.length && i <= 5; i++) {
  574. pageData.value[7].data.push(mkdata.data[5].imgnum[i]);
  575. }
  576. //模块7农村建设
  577. pageData.value[6].data = mkdata.data[6].imgnum;
  578. pageData.value[6].data2 = mkdata.data[6].textnum;
  579. //模块8高端资讯
  580. pageData.value[7].data2 = mkdata.data[7].imgnum;
  581. }else{
  582. ElMessage.error(mkdata.message)
  583. }
  584. }
  585. //获得模块数据
  586. // async function getPageData(catid,img_num,text_num,modulesNum,childNavNum,childImgNum,childTextNum){
  587. // const mkdata = await requestDataPromise('/web/getWebsiteCatidArticle', {
  588. // method: 'GET',
  589. // query: {
  590. // 'catid': catid, //catid
  591. // 'img_num': img_num, //图片数量
  592. // 'text_num': text_num, //文字数量
  593. // 'child_catnum':childNavNum,//子级栏目菜单数量
  594. // 'child_imgnum':childImgNum,//子栏目展示图片新闻数量
  595. // 'child_textnum':childTextNum//子栏目展示文字新闻数量
  596. // },
  597. // });
  598. // if(modulesNum == 1){
  599. // if(mkdata.data.img.length > 0){
  600. // pageData.value[0].data.push(mkdata.data.img[0]);
  601. // }
  602. // if(mkdata.data.img.length > 1){
  603. // pageData.value[0].data2.push(mkdata.data.img[1]);
  604. // }
  605. // if(mkdata.data.img.length > 2){
  606. // pageData.value[0].data2.push(mkdata.data.img[2]);
  607. // }
  608. // if(mkdata.data.img.length > 3){
  609. // pageData.value[0].data2.push(mkdata.data.img[3]);
  610. // }
  611. // if(mkdata.data.img.length > 4){
  612. // pageData.value[0].data2.push(mkdata.data.img[4]);
  613. // }
  614. // // pageData.value[0].data.push(mkdata.data.img[0]);
  615. // // pageData.value[0].data2.push(mkdata.data.img[1]);
  616. // // pageData.value[0].data2.push(mkdata.data.img[2]);
  617. // // pageData.value[0].data2.push(mkdata.data.img[3]);
  618. // // pageData.value[0].data2.push(mkdata.data.img[4]);
  619. // pageData.value[0].data3 = mkdata.data.text;
  620. // }
  621. // if(modulesNum == 2){
  622. // pageData.value[1].data = mkdata.data.img;
  623. // }
  624. // if(modulesNum == 3){
  625. // pageData.value[2].data = mkdata.data.img;
  626. // pageData.value[2].data2 = mkdata.data.text;
  627. // }
  628. // if(modulesNum == 4){
  629. // pageData.value[3].data = mkdata.data.img;
  630. // pageData.value[3].data2 = mkdata.data.text;
  631. // }
  632. // if(modulesNum == 5){
  633. // pageData.value[4].data = mkdata.data.img;
  634. // pageData.value[4].data2 = mkdata.data.text;
  635. // }
  636. // if(modulesNum == 6){
  637. // if(mkdata.data.img.length > 0){
  638. // pageData.value[5].data.push(mkdata.data.img[0]);
  639. // }
  640. // pageData.value[5].data2 = mkdata.data.text;
  641. // if(mkdata.data.img.length > 1){
  642. // pageData.value[7].data.push(mkdata.data.img[1]);
  643. // }
  644. // if(mkdata.data.img.length > 2){
  645. // pageData.value[7].data.push(mkdata.data.img[2]);
  646. // }
  647. // if(mkdata.data.img.length > 3){
  648. // pageData.value[7].data.push(mkdata.data.img[3]);
  649. // }
  650. // if(mkdata.data.img.length > 4){
  651. // pageData.value[7].data.push(mkdata.data.img[4]);
  652. // }
  653. // if(mkdata.data.img.length > 5){
  654. // pageData.value[7].data.push(mkdata.data.img[5]);
  655. // }
  656. // }
  657. // if(modulesNum == 7){
  658. // pageData.value[6].data = mkdata.data.img;
  659. // pageData.value[6].data2 = mkdata.data.text;
  660. // }
  661. // //模块8 向后移动一个位置
  662. // if(modulesNum == 8){
  663. // pageData.value[7].data2 = mkdata.data.img;
  664. // }
  665. // }
  666. //新农村
  667. //模块1 理论前沿
  668. // async function getPageData1() {
  669. // await getPageData(pageData.value[0].cid,5,8,1,0,0,0);
  670. // }
  671. // //模块2 典型经验
  672. // async function getPageData2() {
  673. // await getPageData(pageData.value[1].cid,5,0,2,0,0,0);
  674. // }
  675. // //模块3 农业天地
  676. // async function getPageData3() {
  677. // await getPageData(pageData.value[2].cid,1,6,3,0,0,0);
  678. // }
  679. // //模块4 美丽乡村
  680. // async function getPageData4() {
  681. // await getPageData(pageData.value[3].cid,1,6,4,0,0,0);
  682. // }
  683. // //模块5 农民之家
  684. // async function getPageData5() {
  685. // await getPageData(pageData.value[4].cid,1,6,5,0,0,0);
  686. // }
  687. // //模块6 农业天地
  688. // async function getPageData6() {
  689. // await getPageData(pageData.value[5].cid,6,3,6,0,0,0);
  690. // }
  691. // //模块7 农村建设
  692. // async function getPageData7() {
  693. // await getPageData(pageData.value[6].cid,2,3,7,0,0,0);
  694. // }
  695. // //模块8 高端资讯
  696. // async function getPageData8() {
  697. // await getPageData(pageData.value[7].cid,4,0,8,0,0,0);
  698. // }
  699. // 注意,为了保持模块的数量,当前固定为8个
  700. // 所以这里的农业天地,合并了原来是下面的7号模块
  701. // 而原本是7号模块的地方现在变成了8号模块
  702. //3.渲染页面数据 end ---------------------------------------->
  703. //4.设置seo信息 start---------------------------------------->
  704. //4.1 设置seo信息
  705. const setData = await requestDataPromise('/web/getWebsiteCategoryHead', {
  706. method: 'GET',
  707. query: {
  708. 'catid': routeId
  709. },
  710. });
  711. if(setData.code == 200){
  712. let seoTitle = setData.data.seo_title;
  713. let seoDescription = setData.data.seo_description;
  714. let seoKeywords = setData.data.seo_keywords;
  715. let seoSuffix = setData.data.suffix;
  716. let seoName = setData.data.website_name;
  717. useSeoMeta({
  718. title: seoTitle + "_" + seoSuffix,
  719. meta: [
  720. { name: 'description', content: seoDescription + "_" + seoName + "_" + seoSuffix , tagPriority: 10 },
  721. { name: 'keywords', content: seoKeywords + "_" + seoName + "_" + seoSuffix , tagPriority: 10 }
  722. ]
  723. });
  724. }else{
  725. console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  726. console.log("错误位置:设置分类页面SEO数据")
  727. console.log("后端错误反馈:",setData.message)
  728. console.log("SSR waring ---------- SSR waring ---------- SSR waring ---------->")
  729. }
  730. //4.设置seo信息 end---------------------------------------->
  731. </script>
  732. <style lang="less" scoped>
  733. @import '@/assets/css/class.less';
  734. </style>